<template>
  <view class="assetDetails">
    <view>
      <view class="title">
        <!-- 资产明细 -->
        <view class="left fw-bold">{{ _t18('asset_detail1', ['ebc']) }}</view>
      </view>
      <view class="line"></view>

      <view class="details">

        <view class="top bor" style="justify-content: space-between" @click="switchToTab('平台资产')">
          <view class="top">
            <view class="box" style="background: #17ac74">
            </view>
            <view style="width: 6px;height: 6px;">

            </view>
            <p class="fw-num">平台</p></view>
          <view style="font-size: 16px;font-weight: bold">{{ isFreeze[1].totalValue.toFixed(4) }}</view>
        </view>

        <view class="top bor" style="justify-content: space-between;margin-top: 5%" @click="switchToTab('理财资产')">
          <view class="top">
            <view class="box" style="background: #febe41">
            </view>
            <view style="width: 6px;height: 6px;">

            </view>
            <p class="fw-num">理财</p></view>
          <view style="font-size: 16px;font-weight: bold">{{ isFreeze[2].totalValue.toFixed(4) }}</view>
        </view>
        <view class="top bor" style="justify-content: space-between;margin-top: 5%" @click="switchToTab('合约资产')">
          <view class="top">
            <view class="box">
            </view>
            <view style="width: 6px;height: 6px;">

            </view>
            <p class="fw-num">合约</p></view>
          <view v-if="isFreeze[3]"  style="font-size: 16px;font-weight: bold">{{ isFreeze[3].totalValue.toFixed(4) || 0 }}</view>
          <view v-else  style="font-size: 16px;font-weight: bold" >0.0000</view>
        </view>
      </view>
    </view>
  </view>
</template>

<script setup>
import {_hide, _numberWithCommas, _t18} from '@/utils/public.js'
import {priceFormat} from '@/utils/decimal.js'
import {useUserStore} from "@/store/user";
import {onMounted} from "vue";
import {getgetAccount, getUserInfo} from "@/api/user";
import {dispatchCustomEvent} from "@/utils";
import {storageDict} from "@/config/dict";
import {closeToast} from "vant";
import {useMainStore} from "@/store";
const mainStore = useMainStore()
const userStore = useUserStore()

const isFreeze = ref()
isFreeze.value = userStore.userInfo.appAssetReview

console.log(isFreeze.value ,'isFreeze.value ')
const props = defineProps({
  assetDetails: {
    type: Object
  },
  showNum: {
    type: Boolean
  }
})
onMounted(() => {
  getUserInfos()


})


const getUserInfos = async () => {
  const res = await getUserInfo()
  console.log(res,'asdad')
  isFreeze.value = res.data.appAssetReview
}


const switchToTab = async (e) => {
  mainStore.tabActive = e
}

/**
 * 金额格式化
 * @param {*} amount
 * @param {*} hide
 * @param {*} decimal
 */

const amountFormat = (amount, decimal = 0) => {
  let tempVal = priceFormat(amount, decimal)
  if (props.showNum) {
    tempVal = _numberWithCommas(tempVal)
  } else {
    tempVal = _hide(tempVal)
  }
  return tempVal
}
</script>

<style lang="scss" scoped>
.box {
  background: #555;
  width: 8px;
  height: 8px;
  border-radius: 2px;
}

.assetDetails {
  padding-bottom: 100px;

  & > view {
    padding: 20px 15px;

    .title {
      display: flex;
      justify-content: space-between;
      margin-bottom: 10px;
	  margin-left: 5%;

      .left {
        color: var(--ex-font-color6);
        font-size: 0.426667rem;
        padding-bottom: 4px;
      }

      .yanjin {
        font-size: 16px;
      }
    }

    .details {
		    display: flex
		;
		    flex-direction: column;
		    align-items: center;
      .top {
        display: flex;
width: 90%;
        align-items: center;

        img {
          border-radius: 100%;
          width: 20px;
          height: 20px;
          margin-right: 5px;
        }

        .currencyIcon {
          font-size: 20px;
          margin-right: 5px;
        }

        P {
          font-size: 14px;
          color: var(--ex-font-color6);
        }
      }

      .bottom {
        display: flex;

        & > view {
          flex: 1;
          text-align: center;

          .til {
            padding: 20px 0;
            color: var(--ex-passive-font-color);
          }

          .num {
            color: var(--ex-font-color6);
            font-size: 14px;
          }

          &:first-child {
            text-align: start;
          }

          &:last-child {
            text-align: end;
          }
        }
      }
    }
  }
}

.bor {
  margin-top: 20px;
  padding-bottom: 10px;
}

.line {
  width: 100%;
  height: 5px;
  background: var(--ex-view-bgColor10);
}
</style>
